<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>
 <meta http-equiv="Content-type" content="text/html; charset=utf-8" />

 <title>Demos</title>

 <script type="text/javascript" src="js/jquery/jquery-1.5.min.js"></script>
 <script type="text/javascript" src="js/demo.js"></script>

 <link rel="stylesheet" type="text/css" href="css/style.css" media="screen"/>
 <link rel="stylesheet" type="text/css" href="css/header_footer.css" media="screen"/>
 
 <link rel='stylesheet' href='http://fonts.googleapis.com/css?family=IM+Fell+English' type='text/css' media="screen"/>
 <link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Tangerine" type='text/css' media="screen"/>
</head>

<body>
	<div id='header' class='wrapper_header'>
		<ul id="header_nav" class="nav-right">
			<li>
				<a href="#">contact us</a>
				<ul>
					<li><a href="#">haoyun@baodacraft.com</a></li>
					<li><a href="#">QQ:2715112</a></li>
				</ul>
				<div class="clear"></div>
			</li>
		</ul>
	</div>

	<div class='center'>
		<h1 class='logo'>
			<p class="logo_main_tip">BaoDaCraft</p>
			<p class="logo_sub_tip">iron craft expert</p>
		</h1>
		
		<div class="main-content">
			<div class="main-nav" id="main-nav">
				<ul>
					<li><a id="0" href="#">Product Box 1</a></li>
					<li><a id="1" href="#">Product Box 2</a></li>
					<li><a id="2" href="#">Product Box 3</a></li>
					<li><a id="3" href="#">Product Box 4</a></li>
					<li><a id="4" href="#">Product Box 5</a></li>
					<li><a id="about" href="#">About us!</a></li>
				</ul>
			</div>
			
			<div class="main-view">
				<iframe id="iframe_show_box" src="products/product_0.html" frameborder="0" width="100%" height="100%"></iframe>
			</div>
		</div><!-- .main-content -->
	</div>
   
	<div class="wrapper_footer">
	  <div class="copyright">&copy;Copyright <a href="mailto:skeeey.liu@gmail.com">skeeey.liu</a></div>
	</div>

</body>
</html>
